<!DOCTYPE html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml" xmlns:v-on="http://www.w3.org/1999/xhtml">
	<head>
		<meta charset="utf-8">
		<title>新增live2d</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" href="../lib/layui-v2.5.7/css/layui.css" media="all">
		<link rel="stylesheet" href="../lib/layer-v3.5.1/layer/theme/default/layer.css" media="all">
		<link rel="stylesheet" href="../lib/live2d/css/live2d.css" media="all">
		<link rel="stylesheet" href="../lib/introjs/introjs.min.css" media="all">
		<style>
			[v-cloak] {
				display: none !important;
			}
			.avatar_image {
				-webkit-text-size-adjust: 100%;
				-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
				text-align: center;
				color: #3d4450;
				max-width: 100%;
				vertical-align: middle;
				border: 0;
				overflow: hidden;
				font-size: 12px;
				height: 280px;
				width: 280px;
				display: block;
				transition: transform .3s;
				margin: 2px auto 2px;
			}
		</style>
	</head>
	<body>
		<div id="main-content">
			<div style="padding: 8px; background-color: #F2F2F2;">
				<div class="layui-row layui-col-space4">
					<div class="layui-col-md3">
						<div id="landlordTop" style="width: 270px;height: 270px">
							<div id="live2d-tips" class="live2d-tips" style="opacity: 1;"></div>
							<canvas id="live2d" width="250" height="250" class="live2d"></canvas>
							<div class="live2d-tool">
								<span class="fui-home"></span>
								<span class="fui-user"></span>
								<span class="fui-chat"></span>
								<span class="fui-photo"></span>
								<span class="fui-cross"></span>
							</div>
						</div>
					</div>
					<div class="layui-col-md3">
						<div class="layui-card">
							<div class="layui-card-body" style="text-align: center;">
								<div class="layui-upload-drag" id="uploadZipDiv">
									<i class="layui-icon"></i>
									<p>点击上传，或将文件拖拽到此处</p>
								</div>
							</div>
						</div>
					</div>

					<div class="layui-col-md6">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">模型名</label>
										<div class="layui-input-block">
											<input type="text" name="modelName" v-model="live2dInfo.modelName" required
												lay-verify="required" value="" placeholder="(必填)模型名" autocomplete="off"
												id="modelNameInput" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md6">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">模型json路径</label>
										<div class="layui-input-block">
											<input type="text" name="modelJsonPath" v-model="live2dInfo.modelJsonPath"
												required lay-verify="required" value="" placeholder="(必填)模型json路径"
												id="modelJsonPathInput" autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>


					<div class="layui-col-md3">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="" onsubmit="return false">
									<img v-bind:src="live2dInfo.modelImagePath" class="avatar_image" />
								</form>
							</div>
						</div>
					</div>


					<div class="layui-col-md4">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">模型预览图片路径</label>
										<div class="layui-input-block">
											<input type="text" name="modelImagePath" v-model="live2dInfo.modelImagePath"
												required lay-verify="required" placeholder="(必填)模型预览图片路径"
												autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="" onsubmit="return false">
									<div class="layui-form-item">
										<button type="button" class="layui-btn" id="updatePreviewButton">
											<i class="layui-icon"></i>
											上传预览
										</button>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md4">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">背景图片路径</label>
										<div class="layui-input-block">
											<input type="text" name="backgroundPath" v-model="live2dInfo.backgroundPath"
												required lay-verify="required" value="" placeholder="(必填)背景图片路径"
												autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="" onsubmit="return false">
									<div class="layui-form-item">
										<button type="button" class="layui-btn" id="updateBackgroundButton">
											<i class="layui-icon"></i>
											上传背景图片
										</button>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">x</label>
										<div class="layui-input-block">
											<input type="text" name="x" v-model="live2dInfo.x" required
												lay-verify="required" value="" placeholder="(必填)x" autocomplete="off"
												class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">y</label>
										<div class="layui-input-block">
											<input type="text" name="y" v-model="live2dInfo.y" required
												lay-verify="required" value="" placeholder="(必填)y" autocomplete="off"
												class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">缩放</label>
										<div class="layui-input-block">
											<input type="text" name="scale" v-model="live2dInfo.scale" required
												lay-verify="required" value="" placeholder="(必填)scale"
												id="scaleInput" autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>


					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">宽</label>
										<div class="layui-input-block">
											<input type="text" name="width" v-model="live2dInfo.width" required
												lay-verify="required" value="" placeholder="(必填)width"
												autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>


					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">高</label>
										<div class="layui-input-block">
											<input type="text" name="height" v-model="live2dInfo.height" required
												lay-verify="required" value="" placeholder="(必填)height"
												autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">锚点x</label>
										<div class="layui-input-block">
											<input type="text" name="anchorx" v-model="live2dInfo.anchorx" required
												lay-verify="required" value="" placeholder="(必填)anchorx"
												autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">锚点y</label>
										<div class="layui-input-block">
											<input type="text" name="anchory" v-model="live2dInfo.anchory" required
												lay-verify="required" value="" placeholder="(必填)anchory"
												autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="" onsubmit="return false">
									<div class="layui-form-item">
										<button class="layui-btn" id="refreshButton" onclick="updateModelProperty(vueObject.live2dInfo)">
											<i class="layui-icon layui-icon-util"></i>
											刷新模型
										</button>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item" pane="" id="showMarkDiv">
										<label class="layui-form-label">是否展示</label>
										<div class="layui-input-block">
											<input type="checkbox" checked="" name="open" lay-skin="switch"
												lay-filter="switchShowMark" lay-text="ON|OFF"
												:checked="live2dInfo.showMark==1">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md4">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="">
									<div class="layui-form-item">
										<label class="layui-form-label">描述</label>
										<div class="layui-input-block">
											<input type="text" name="description" v-model="live2dInfo.description"
												required lay-verify="required" value="" placeholder="description"
												autocomplete="off" class="layui-input">
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>

					<div class="layui-col-md2">
						<div class="layui-card">
							<div class="layui-card-body">
								<form class="layui-form layui-form-pane" action="" onsubmit="return false">
									<div class="layui-form-item">
										<button class="layui-btn" id="submitLive2dButton" v-on:click=insertLive2d()>
											<i class="layui-icon layui-icon-release"></i>
											发布模型
										</button>
										<button class="layui-btn" onclick="showHelp()">
											<i class="layui-icon layui-icon-help"></i>
										</button>
									</div>
								</form>
							</div>
						</div>
					</div>

				</div>
			</div>
		</div>
	</body>
	<script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
	<script src="../lib/layer-v3.5.1/layer/layer.js" charset="utf-8"></script>
	<script src="../lib/axios/axios.min.js"></script>
	<script src="../lib/vue-module/vue.js"></script>
	<script src="../js/main.js"></script>
	<script src="../lib/layui-v2.5.7/layui.js" charset="utf-8"></script>
	<script src="../js/lay-config.js?v=2.0.0" charset="utf-8"></script>
	<script src="../lib/live2d/js/live2dcubismcore.js"></script>
	<script src="../lib/live2d/js/live2d.min.js"></script>
	<script src="../lib/live2d/js/pixi.min.js"></script>
	<script src="../lib/live2d/js/pixi-live2d-display.js"></script>
	<script src="../lib/introjs/intro.min.js"></script>
	<script>
		function showHelp(){
			introJs().setOptions({
				steps: [{
					element: document.querySelector('#uploadZipDiv'),
					intro: '<img src="../images/guide/7.jpg" width="250" height="250">将模型打包压缩成zip后拖入此处上传'
				}, {
					element: document.querySelector('#landlordTop'),
					intro: '<img src="../images/guide/1.gif" width="250" height="200">成功上传模型后，模型将会展示'
				}, {
					intro: '<img src="../images/guide/6.png" width="250" height="150">请注意，系统会在上传模型后去寻找压缩包里面model.json或model3.json文件，以及preview或截图文件，如果找得到，就会自动填充模型json及模型预览的输入框'
				}
				, {
					element: document.querySelector('#refreshButton'),
					intro: '<img src="../images/guide/8.jpg" width="250" height="250">这个用于在设置模型的属性后刷新模型，比如设置缩放比率，x，y等'
				},{
					element: document.querySelector('#showMarkDiv'),
					intro: '<img src="../images/guide/2.jpg" width="250" height="250">如果你不想在博客的前台展示这个模型，可以选择关闭这个模型'
				}, {
					element: document.querySelector('#scaleInput'),
					intro: '<img src="../images/guide/2.gif" width="250" height="200">当模型大小过大时，调整模型缩放比率，一般为0.05-0.10之间'
				}, {
					element: document.querySelector('.live2d-tool>.fui-photo'),
					intro: '<img src="../images/guide/3.gif" width="250" height="200">点击拍照即可快速生成模型预览或者用户自己上传预览文件'
				}, {
					element: document.querySelector('#updateBackgroundButton'),
					intro: '<img src="../images/guide/4.gif" width="250" height="200">上传你自己喜欢的背景图片，或者你不想要背景图片，置空即可'
				}, {
					element: document.querySelector('#submitLive2dButton'),
					intro: '<img src="../images/guide/5.gif" width="250" height="200">最后发布你的模型即可'
				}, {
					intro: '<img src="../images/guide/giphy.webp" width="250" height="200">开始愉快创建你专属的看板娘吧'
				}]
			}).start();
		}

		const vueObject = new Vue({
			el: "#main-content",
			data: {
				live2dInfo: {
					id: 0,
					modelName: "",
					modelJsonPath: "",
					modelImagePath: "",
					backgroundPath: "",
					x: 0.0,
					y: 0.0,
					scale: 0.1,
					width: 250,
					height: 250,
					anchorx: 0.00,
					anchory: 0.00,
					showMark: 1,
					description: "",
					baseFilePath: "",
					createTime: "",
					updateTime: ""
				}
			},
			watch: {
				/**监听对象或数组的时候，要用到深度监听**/
				/**live2dInfo: {
					handler(newValue, oldValue) {
						console.log(newValue);
					},
					immediate: true,
					deep: true
				}**/
			},
			methods: {
				insertLive2d() {
					axiosPostFunction("/uploads/live2d/authApi/live2d/insert", this.live2dInfo, true).then((responseData) => {
						if (responseData) {
							layer.alert(responseData, {icon: 1, skin: 'layui-layer-molv', closeBtn: 0, anim: 4});
						}
					}).catch(function (err) {console.warn(err);});
				},
			},
			created: function() {

			}
		});

		const app = new PIXI.Application({
			view: document.getElementById('live2d'),
			autoStart: true,
			width: 250,
			height: 250,
			transparent: true, /*画布透明*/
		});

		function canvasToImageUpload() {
			let base64Img = app.renderer.plugins.extract.base64(app.stage); /**返回截图路径  截图是base64的**/
			layer.alert('<img width="300" height="300" src="' + base64Img + '"/>', {
				skin: "layui-layer-molv",
				closeBtn: 1,
				anim: 1,
				title: '拍照生成预览',
				yes: function(index, layero) {
					let blob = base64ToBlob(base64Img, 'image/png');
					axiosUploadFile("/uploads/upload/authApi/image", blob, new Date().getTime() + '.png').then(function (response) {
						if (response) {
							layer.msg('上传成功');
							/*设置vue对象data里的对象值，这里设置模型的图片路径，对应的v-src就会更新图片*/
							vueObject.live2dInfo.modelImagePath = response;
						}
					}).catch(function (reason) {
						layer.msg('出错原因:' + reason, {icon: 5, time: 4000});
					})
					layer.close(index); /**如果设定了yes回调，需进行手工关闭**/
				},
				cancel: function(index, layero) {
					layer.close(index);
					return false;
				},
				success: function() {},
			});
		}

		function base64ToBlob(urlData, type) {
			let arr = urlData.split(',');
			let mime = arr[0].match(/:(.*?);/)[1] || type;
			// 去掉url的头，并转化为byte
			let bytes = window.atob(arr[1]);
			// 处理异常,将ascii码小于0的转换为大于0
			let ab = new ArrayBuffer(bytes.length);
			// 生成视图（直接针对内存）：8位无符号整数，长度1个字节
			let ia = new Uint8Array(ab);
			for (let i = 0; i < bytes.length; i++) {
				ia[i] = bytes.charCodeAt(i);
			}
			return new Blob([ab], {
				type: mime
			});
		}

		$('.live2d-tool .fui-photo').click(function() {
			showMessage('照好了嘛，是不是很可爱呢？', 5000, true);
			canvasToImageUpload();
		});

		function showMessage(text, timeout) {
			if (Array.isArray(text)) text = text[Math.floor(Math.random() * text.length + 1) - 1];
			//console.log('showMessage', text);
			$('#live2d-tips').stop();
			$('#live2d-tips').html(text).fadeTo(200, 1);
			if (timeout === null) timeout = 5000;
			hideMessage(timeout);
		}

		function hideMessage(timeout) {
			$('#live2d-tips').stop().css('opacity', 1);
			if (timeout === null) timeout = 5000;
			$('#live2d-tips').delay(timeout).fadeTo(200, 0);
		}

		/**
		 * 销毁当前正在演示的模型，防止内存泄露
		 */
		function destroyCurrentModel() {
			/**
			 * 单纯的移除容器里面的孩子不销毁它就有可能会发生内存泄露，所以在项目中调用removeChildren方法时，
			 * 推荐把移除的孩子也销毁。销毁它很简单，只需要给移除的孩子也调用destroy方法即可
			 */
			let removedChildren = app.stage.removeChildren(0, app.stage.children.length);
			removedChildren.forEach((c) => {
				c.destroy({
					children: true,
					texture: false,
					baseTexture: false,
				});
			});
		}

		window.onbeforeunload = () => {
			destroyCurrentModel();
			/**在离开页面时需要手动清理内存，否则无法释放WebGL内存**/
			app.destroy(true);
		};

		app.view.addEventListener('pointerdown', event => {
			/*点击的时候触发随机表情*/
			if (app.stage.children.length > 0) {
				let model = app.stage.children[0];
				if (model.internalModel.motionManager.motionGroups) {
					let keys = Object.keys(model.internalModel.motionManager.motionGroups);
					let keyItem = keys[Math.floor(Math.random() * keys.length)];
					if (keyItem == 'emotion') {
						return;
					}
					model.motion(keyItem);
				}
			}
		});

		function updateModelProperty(live2dInfo) {
			/*用户修改live2d的属性时，重新设置值并刷新live2d*/
			if (app.stage.children.length > 0) {
				let model = app.stage.children[0];
				model.x = live2dInfo.x;
				model.y = live2dInfo.y;
				model.scale.set(live2dInfo.scale);
				model.anchor.set(live2dInfo.anchorx, live2dInfo.anchory);
				app.width = live2dInfo.width;
				app.height = live2dInfo.height;
				console.log(app);
				let backgroundPath = live2dInfo.backgroundPath;
				let landlordTopSelector = $("#landlordTop");
				if (undefined != backgroundPath && null != backgroundPath && '' != backgroundPath) {
					landlordTopSelector.css({"background-image": "url('" + backgroundPath + "')"});
					landlordTopSelector.addClass("bgDiv");
				} else {
					landlordTopSelector.css({"background-image": ""});
					landlordTopSelector.removeClass("bgDiv");
				}
				/**model.expression(0);**/
			} else {
				let live2dInfo = vueObject.live2dInfo;
				if (live2dInfo.modelJsonPath != '') {
					runModel(live2dInfo);
				}
			}
		}

		async function runModel(live2dInfo) {
			destroyCurrentModel();
			const model = await PIXI.live2d.Live2DModel.from(live2dInfo.modelJsonPath, {
				onError: console.warn
			});
			app.stage.addChild(model);
			model.expression(0);
			model.x = live2dInfo.x;
			model.y = live2dInfo.y;
			model.scale.set(live2dInfo.scale);
			model.anchor.set(live2dInfo.anchorx, live2dInfo.anchory); /**锚点，以画布中心下方为中心点,x，y（单位：倍）**/
			model.internalModel.motionManager.on('motionStart', (group, index, audio) => {
				/**console.log(group);
				console.log(index);**/
				if (audio) {
					try {
						/*如果模型的json文件里面有存有音频的译文，将它展示出来*/
						let motionItem = model.internalModel.settings.json.FileReferences.Motions[group][index];
						if (undefined != motionItem && null != motionItem && undefined != motionItem['Text']) {
							showMessage(motionItem['Text'], 8000);
						}
					} catch (error) {
						console.warn(error);
					}
					audio.addEventListener('ended', () => {});
				}
			});
			let backgroundPath = live2dInfo.backgroundPath;
			let landlordTopSelector = $("#landlordTop");
			if (undefined != backgroundPath && null != backgroundPath && '' != backgroundPath) {
				landlordTopSelector.css({"background-image": "url('" + backgroundPath + "')"});
				landlordTopSelector.addClass("bgDiv");
			} else {
				landlordTopSelector.css({"background-image": ""});
				landlordTopSelector.removeClass("bgDiv");
			}
		}

		layui.use(['upload', 'form'], function() {
			let $ = layui.$,
				form = layui.form,
				layer = layui.layer,
				upload = layui.upload;

			let token = getToken();
			upload.render({
				elem: '#uploadZipDiv',
				url: apiBaseUrl + '/uploads/live2d/authApi/live2d/zip',
				method: 'POST',
				headers: {
					Authorization: token
				},
				exts: 'zip|tar',
				/**data: { Parm1: "hello", Parm2: "world" },**/
				multiple: false,
				/**多文件上传**/
				auto: true,
				accept: 'file',
				/**bindAction: '#uploadBtn',**/
				done: function(response, index, upload) {
					console.log(response);
					let respData = response.data;
					let respCode = response.code;
					let message = response.message;
					if (respCode == 200) {
						layer.msg('上传成功');
						vueObject.live2dInfo = respData;
						runModel(vueObject.live2dInfo);
					} else if (respCode == 400) {
						layer.msg("客户端错误：" + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 401 || respCode == 403 || respCode == 500) {
						layer.msg('msg：' + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 402) {
						layer.msg('认证失败，msg：' + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 302) {
						location.href = "../adminLogin.html";
					} else {
						console.log(response);
					}
				},
				error: function(index, upload) {
					layer.msg('上传文件失败', {icon: 5, time: 4000});
				}
			});


			upload.render({
				elem: '#updatePreviewButton',
				url: apiBaseUrl + '/uploads/upload/authApi/image',
				method: 'POST',
				headers: {
					Authorization: token
				},
				exts: 'jpg|jpeg|gif|png|ico|webp',
				multiple: false,
				auto: true,
				accept: 'file',
				done: function(response, index, upload) {
					console.log(response);
					let respData = response.data;
					let respCode = response.code;
					let message = response.message;
					if (respCode == 200) {
						layer.msg('上传成功');
						vueObject.live2dInfo.modelImagePath = respData;
					} else if (respCode == 400) {
						layer.msg("客户端错误：" + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 401 || respCode == 403 || respCode == 500) {
						layer.msg('msg：' + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 402) {
						layer.msg('认证失败，msg：' + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 302) {
						location.href = "../adminLogin.html";
					} else {
						console.log(response);
					}
				},
				error: function(index, upload) {
					layer.msg('上传文件失败', {
						icon: 5,
						time: 4000
					});
				}
			});

			upload.render({
				elem: '#updateBackgroundButton',
				url: apiBaseUrl + '/uploads/upload/authApi/image',
				method: 'POST',
				headers: {
					Authorization: token
				},
				exts: 'jpg|jpeg|gif|png|ico|webp',
				multiple: false,
				auto: true,
				accept: 'file',
				done: function(response, index, upload) {
					console.log(response);
					let respData = response.data;
					let respCode = response.code;
					let message = response.message;
					if (respCode == 200) {
						layer.msg('上传成功');
						vueObject.live2dInfo.backgroundPath = respData;
						let backgroundPath = vueObject.live2dInfo.backgroundPath;
						let landlordTopSelector = $("#landlordTop");
						if (undefined != backgroundPath && null != backgroundPath && '' != backgroundPath) {
							landlordTopSelector.css({"background-image": "url('" + backgroundPath + "')"});
							landlordTopSelector.addClass("bgDiv");
						} else {
							landlordTopSelector.css({"background-image": ""});
							landlordTopSelector.removeClass("bgDiv");
						}
					} else if (respCode == 400) {
						layer.msg("客户端错误：" + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 401 || respCode == 403 || respCode == 500) {
						layer.msg('msg：' + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 402) {
						layer.msg('认证失败，msg：' + respCode + ":" + message, {icon: 5, time: 4000});
					} else if (respCode == 302) {
						location.href = "../adminLogin.html";
					} else {
						console.log(response);
					}
				},
				error: function(index, upload) {
					layer.msg('上传文件失败', {
						icon: 5,
						time: 4000
					});
				}
			});

			/*监听layui绑定的开关事件，当开关的值改变的时候实时更新vue对象data的值*/
			form.on('switch(switchShowMark)', function(data) {
				if (this.checked) {
					vueObject.live2dInfo.showMark = 1;
				} else {
					vueObject.live2dInfo.showMark = 0;
				}
			});
		});
	</script>
</html>
